import React, { Component } from 'react'


//Header
function Header() {
  return <h2>Header</h2>
}

//Main
function Banner() {
  return <h4>Banner</h4>
}

function ProductList() {
  return (
    <ul>
      <li>列表1</li>
      <li>列表2</li>
      <li>列表3</li>
      <li>列表4</li>
      <li>列表5</li>
    </ul>
  )
}

function Main() {
  return (
    <div>
      <h2>Main</h2>
      <Banner></Banner>
      <ProductList></ProductList>
    </div>
  )
}

//Footer
function Footer() {
  return <h2>Footer</h2>
}

export default class App extends Component {
  render() {
    return (
      <div>
        <Header></Header>
        <Main></Main>
        <Footer></Footer>
      </div>
    )
  }
}
